FRONTEND DEVELOPMENT RESOURCES
This is a collection of layouts, links, and tutorials that may help you with coding and web design from SKYE JOURNEY!
> W3Schools - free resource for learning how to code
> CodePen - online code editor with public and open source creations
> Layoutit - CSS grid layout generator
> jQuery Script - various jQuery plugins and tutorials
> CSS Background Patterns - generates background patterns using CSS
> Clippy - makes complex shapes using pure CSS
> Hover.css - CSS transitions
> phuoc.ng - CSS/JavaScript codes and tutorials
> FC2 Counter - free site counter with many design options
> 90's Cursor Effects - a collection of effects for your cursor!
> 30 seconds of code - data resources to get you started as a developer
> JavaScript Free Code - set of codes to use in JavaScript
> CodeSecrets - Tumblr blog of different resources and coding tutorials
> A Guide to HTML - a guide written in Docs on how to get started with HTML
> HTML Cheat Sheet - notes for using in HTML
> HTML Codes - a lot of HTML codes to use and very useful tutorials!
> JavaScript Kit - web building tutorials and more resources
> mf2fm - JavaScript codes free to use on your website
> CodeBeautify - useful coding tools
> CSSmatic - CSS tools for web designers
> Chattable - a FREE, fully customizable, live chat tool for your website
> Codeframe - online pastebin-like playground for building websites using HTML, CSS, and JavaScript
> Pastebin - Pastebin can store texts like code, notes, and snippets online for a set time which can be shared instantly
> sdmg5 - a GitHub page with resources for coding, useful sites to stay informed and learn new things
> Visual Studio Code - this software lets you code in all kinds of languages with live preview. It is highly used but has a learning curve!
> MDN Web Docs - resources for developers, by developers, in HTML, CSS, and JavaScript
> Devdocs - a comprehensive documentation aggregator that provides quick access to documentation for various programming languages, frameworks, and libraries in one place!
> CSS TRICKS - guides and resources for CSS
> Codedex - start your coding adventure: gamify your learning experience and have fun learning how to code!
> freeCodeCamp - Learn to code and build projects for nonprofits. Build your full stack web development portfolio today.
> Blackbird School - Learn to code online with our beginner-friendly platform.
> Glitch - Great place to play around with code in an easy-to-set-up environment.
> Reddit.com/r/dailyprogrammer - interesting programming challenges where you can learn from looking at other's code, even if you are not able to solve code you can look at how others solved.
> Programming by Doing - very good site for those who want to start with absolute basics.
> CodeAbbey - a place where everyone can master programming: best place to begin with problems that start at the easiest and gradually increase difficulty with each problem.
> Exercism.io - download and solve practice problems in over 50 different languages, and share your solution with others.
> Daily.dev - a professional network for developers to learn, collaborate, and grow together!
> Wappalyzer - useful tool to see what technologies a website is made with!
> Readme.so - simple editor that allows you to quickly add and customize all the sections you need for your project's readme.
> Roadmap.sh - community effort to create roadmaps, guides and other educational content to help guide developers in picking up a path and guide their learnings.
> Metatags.io - useful tool to help with SEO.
> Ray.so - useful tool to share your codes!
GRAPHICS/DESIGN RESOURCES
> Photopea - free online Photoshop alternative
> PhotoMosh - glitches images and videos using WebGL effects
> Pattern Cooler - generates seamless patterned backgrounds
> SauceNAO - reverse image searches artworks
> emojiBank - a Japanese site that houses thousands of pixel images that can be downloaded by right clicking and inspecting elements
> cho.mayulog.net - a Japanese site that houses many cute graphics
> Fool Lovers - a Japanese site that houses graphics and layouts
> cute kawaii resources - a site with icons and cute graphics for your website
> hikoushi favicons - a set of useful favicons
> glitter-graphics - graphic text generator
> Canva - a graphic design platform that allows users to create and share visual content, such as presentations, social media graphics, posters, and websites!
> hex color wheel - color design tool
> rgba color picker - color selection tool
> background remover - tool to clean image backgrounds
> image converter - online file converter!
> cloudconvert - another online file converter
> Muuri - a JavaScript layout engine that allows you to build all kinds of layouts (no kidding!) and make them responsive, sortable, filterable, draggable and/or animated
> JoshwComeau - a perfect website with visual tutorials for design and frontend development with HTML, CSS, and JavaScript!
> lightGallery - for website galleries
> Flickity - touch, responsive, flickable carousels
> anime.js - JavaScript library for animation!
> DOODAD.dev - dither images or create backgrounds
QUICK TOOLS
> CSS grid generator
> Flex generator
> HTML formatter
> CSS formatter
> HTML validator
> CSS validator
> Find unclosed divs
> CSS grid visual cheatsheet
> Flexbox visual cheatsheet
> Accessibility tools